<template>
  <div class="ec-chat-l">
    <div class="ec-user-img"><img src="static/images/eng-corner/chatuser1.png" alt=""/></div>
    <div class="chat-box-l">{{chattxtl}}
      <div class="chat-box-l-name">{{chatuser}}</div>
    </div>
  </div>
</template>
<script>
    export default{
      name:'ec-chat-l',
      data:function(){
        return {
          test:'hello'
        }
      },
      props:['chattxtl','chatuser']
    }
</script>
<style>
.ec-chat-l {
  width: 100%;
  display: flex;
}
.ec-user-img{
  margin-top:70px;
}
.ec-user-img img{
  width: 120px;
  height:120px;
}
.chat-box-l{
    width:70%;
    padding: 50px 20px;
    margin: 0 5%;
    height:50px;
    border: 1px solid #ddd;
    background: #ffffff;
    border-radius:30% 40% 40% 0;
    box-shadow: 10px 10px 10px #ddd;
    color:#8B8B8B;
    font-size: 30px;
  }
  .chat-box-l-name{
    align-self: flex-end;
    text-align: left;
    color:#8B8B8B;
    opacity: .6;
    font-size: 18px;
    margin: 10px 0;
  }
</style>
